<template>
	<div class="order-info-page">
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		 <div class="order-block" style="margin-top:0px">
			 <u-cell-group :border="false">
				<u-cell isLink :border="!priceId" @click="toMyAuthenticationList()">
					<view slot="title" class="u-slot-title">我的公司</view>
					<text slot="value" class="u-slot-value">{{companyName}}</text>
				</u-cell>
				
				<u-cell :border="false" v-if="goodsId">
					<view slot="title" class="u-slot-title">交货方式</view>
					<div slot="value" class="u-slot-value">
						<u-radio-group v-model="sendType" placement="row">
							<u-radio label="自提" name="自提"> </u-radio>
							<div style="width:20px;"></div>
							<u-radio label="送到" name="送到"> </u-radio>
						</u-radio-group>
					</div>
				</u-cell>
				
			 </u-cell-group>
		 </div>
		 
		 <div class="order-info-adr" style="margin-top:8px;padding:0" v-if="(priceId && info.sendTypes == '送到') || (goodsId && sendType == '送到')">
			 <u-cell-group :border="false">
			 	<u-cell isLink :border="false" @click="toAddressList()" v-if="info.defaultAddress">
					<view slot="title" class="u-slot-title">
						<img src="https://pic.moresu.com/FskOos8zWjFXelWQ5AsbUqx7Ayz7" style="width:30px;height:30px;" mode="aspectFit"/>
					</view>
					<div class="adr-info" slot="value">
						 <div class="adr-top"><span class="name">{{info.defaultAddress.receiveName}}</span><span class="phone">{{info.defaultAddress.mobile}}</span></div>
						 <div class="adr-bottom">{{info.defaultAddress.areaInfo}}{{info.defaultAddress.addressInfo}}</div>
					</div>	
				</u-cell>
				<u-cell isLink :border="false" @click="toAddressList()" v-else>
					<view slot="title" class="u-slot-title">
						<img src="https://pic.moresu.com/FskOos8zWjFXelWQ5AsbUqx7Ayz7" style="width:30px;height:30px;" mode="aspectFit"/>
					</view>
					<div class="adr-info" slot="value">
						 <div class="adr-bottom">暂无地址信息，去新建地址</div>
					</div>	
				</u-cell>
			 </u-cell-group>
		 </div>
		 
		  <!--商品-->
		 <div class="order-block">
			 <div class="goods-info-block" style=" background: #fff;">
				<div class="order-item-top link-bg">
					 <div class="store-name">
						供方公司
					   <img src="https://pic.moresu.com/Fv5khT_sfxuIWWf3sTuejsl0Bvbh" style="width: 38rpx;height:31rpx;display: inline-block;vertical-align: middle;margin-left:8px"/>
					   <span style="padding-left:10rpx;vertical-align: middle;">{{info.storeName}}</span>
					 </div>
				</div>
				 <div class="goods-item">
					 <div class="goods-info">
						 <div class="goods-name">{{ info.categoryName }}/{{info.brandName}}/{{info.goodsSn}}</div>
						 <div class="order-row" style="margin-top:20rpx;" v-if="priceId">
							 <span class="label">交货方式：</span>
							 <span class="text">{{info.payTypes}}{{info.sendTypes}}</span>
						 </div>
						 <div class="order-row">
							 <span class="label">交货日期：</span>
							 <span class="text">{{info.receiveDate}}</span>
						 </div>
						 <div class="order-row">
							 <span class="label">货物单价：</span>
							 <span class="text">{{info.goodsPrice}}元/吨</span>
						 </div>
						 
						 <div class="order-row" v-if="info.goodsWeight">
							 <span class="label">包装：</span>
							 <span class="text">{{info.goodsWeight}}吨/包</span>
						 </div>
						 
						 <div class="order-row" v-if="info.minBuyNum">
							 <span class="label">起订量：</span>
							 <span class="text">{{info.minBuyNum}}吨</span>
						 </div>
						 
						 <div class="order-row" v-if="priceId">
							 <span class="label">货物数量：</span>
							 <span class="text">{{info.priceNum}}吨</span>
						 </div>
						 <div class="order-row" v-else>
							 <span class="label">货物数量：</span>
							 <span class="text">
								 <div style="display: inline-block;">
									 <!-- #ifdef MP -->
									 <u-number-box v-model="goodsNum" :integer="false" :disabledFomatted="true" :step="info.goodsWeight" :min="info.minBuyNum" @change="valChange"></u-number-box>
									 <!-- #endif -->
									 <!-- #ifdef H5 -->
									 <u-number-box v-model="goodsNum" :integer="false"  :step="info.goodsWeight" :min="info.minBuyNum" :disabledInput="true" @change="valChange"></u-number-box>
									 <!-- #endif -->
								 </div>
								 <span style="display: inline-block;margin-left:5px">吨</span>
							 </span>
							 
						 </div>
						 <div class="order-row">
							 <span class="label">发货地区：</span>
							 <span class="text">{{info.sendArea}}</span>
						 </div>
						 <div class="order-row">
							 <span class="label" style="white-space:nowrap">产品说明：</span>
							 <span class="text">{{info.colorProducerWeightRemarkStr}}</span>
						 </div>
					 </div>
				 </div>
			 </div>
		 </div>
		 
		 <div v-if="goodsId && sendType == '送到'">
			 <u-alert title=" " type = "error" description = "【送到】订单需要供方填写【运费】，下单之后请在确认签约的同时确认【运费】，【运费】填写后将会包含至商品单价中。"></u-alert>
		 </div>
		 <div class="order-price-block">
			 <u-cell-group :border="false">
				<u-cell isLink @click="seeCoupon()" v-if="couponList.length > 0">
					<view slot="title" class="u-slot-title">选择优惠券</view>
					<text slot="value" class="u-slot-value">{{offAmount > 0 ? '-￥'+offAmount : ''}}</text>
				</u-cell>
				<u-cell :border="false">
					<view slot="title" class="order-price-label" >合计总额</view>
					<span slot="value" class="order-price-text">
						<span v-if="priceId">￥{{info.orderAmount | fiforderAmount2(offAmount)}}</span>
						<span v-else-if="goodsId&& sendType != '送到'">￥{{info.goodsPrice | fiforderAmount(goodsNum,info.freight,offAmount)}}</span>
						<span v-else-if="goodsId&& sendType == '送到'">待下单后确认运费</span>
					</span>
				</u-cell>			
			 </u-cell-group>
		 </div>
		 
		 <div class="order-block" style="margin-top:0">
			 <view style="padding:16px">
				 <view class="u-slot-title" style="height:30px;">订单备注</view>
				 <textarea v-model="orderRemark" placeholder="请输入内容"  class="u-slot-value" style="font-size:14px;height:60px"></textarea>
			 </view>	
		 </div>
		
		<view class="page-bottom-btn" :style="{paddingBottom:systemInfo.tabbarPaddingB+'px',paddingLeft:'20rpx',paddingRight:'20rpx'}">
			<u-button text="提交订单" type="primary" shape="circle" :loading="btnloading" @click="saveOrder"></u-button>
		</view>
		
		<u-popup :show="show" mode="bottom"  @close="closeShow" :round="23">
			<div>
				<div class="popupTitle" style="text-align: left;padding-left:16px;">
					<img src="https://pic.moresu.com/FvrReiN9BLYzIoiRyQJ6ih2RM64J" style="width:15px;height:17px;display: inline-block;vertical-align: middle;"/>
					<span style="padding-left:20rpx;vertical-align: middle;">选择优惠券</span>
				</div>
				<div class="popup-con" style="padding:0 24px 16px 24px;margin-top:10px;max-height:600rpx;overflow-y: auto;">
					 <u-radio-group v-model="value" placement="row">
						<u-radio :customStyle="{marginBottom: '16px'}" v-for="(item, index) in couponList" :key="index"  :name="item.couponSn" >
							<div class="coupon-item" :class="{'gary':item.couponState != 0}" :key="item.id">
								<div class="coupon-label">满减券</div>
								<div class="coupon-top">
								  <div class="top-left">
									<div class="coupon-name">{{item.couponName}}</div>
									<div class="coupon-time">有效期至{{item.endTime}}</div>
								  </div>
								  <div class="top-right">
									<div class="coupon-price"><span class="span" style="padding-left:0;padding-right:10rpx">减</span>{{item.couponAmount}}<span class="span">{{item.couponUnit}}</span></div>
									<div class="right-bottom">满{{item.limitWeight}}吨可用</div>
								  </div>
								</div>
								<div class="coupon-bottom">
								  <div class="coupon-line"></div>
								  <div style="display: flex;justify-content: flex-start;align-items: center;" @click="changzk(index)" v-if="!item.isZK">
									  <div class="coupon-text" style="flex:1;">使用规则：{{item.couponWords}}</div>
									  <div style="width:50rpx;display: flex;justify-content: flex-end;">
										  <u-icon name="arrow-down"></u-icon>
									  </div>
								  </div>
								  <div style="display: flex;justify-content: flex-start;align-items: flex-end;" @click="changzk(index)" v-else>
									  <div style="flex:1;padding-top:6rpx;font-size: 24rpx;color:#888;">使用规则：{{item.couponWords}}</div>
									  <div style="width:50rpx;display: flex;justify-content: flex-end;">
										  <u-icon name="arrow-up"></u-icon>
									  </div>
								  </div>
								</div>
							 </div>
						</u-radio>
					 </u-radio-group>
					 
				</div>
				<div style="width:100%;padding:24rpx;bottom:0;background: #fff;border-top:1px solid #eee">
				  <u-button text="确认" shape="circle" type="primary" @click="save"></u-button>
				</div>
			</div>
		</u-popup>
	 
	</div>
</template>

<script>
import base from '@/config/baseUrl.js';
import {
    preOrderContent,createOrder,pageSeo
  } from '@/config/api.js'
  import store from '@/store';
  import {orderCouponList}  from '@/config/coupon.js'
  const log = require('@/plugins/log.js')
export default {
    data() {
        return {
            systemInfo:base.systemInfo,
            orderRemark:'',
			priceId:'',
			info:{},
			companyId:'',
			addressId:'' ,
			btnloading:false,
			companyName:'',
			goodsId:'',
			sendType:'',
			goodsNum:'',
			couponSn:'',
			show:false,
			couponList:[],
			value:''
        };
    },

	computed:{
	    offAmount(){
	      if(this.couponSn != ''){
	        let couponItem = null;
	        this.couponList.forEach((el)=>{
	          if(el.couponSn == this.couponSn) {
	            couponItem = el;
	          }
	        });
	        if(couponItem){
	          if(couponItem.amountType == 0){
	            let num = this.goodsId ? this.goodsNum : this.info.priceNum;
	            return parseFloat(couponItem.couponAmount * num).toFixed(0);
	          }else{
	            return parseFloat(couponItem.couponAmount ).toFixed(0);
	          }
	        }else{
	          return 0
	        }
	
	      }
	      return 0
	    },
	  },
    onShow() {
		//选择地址页过来
        uni.getStorage({
            key:'selectAddress',
            success: (e) => {
                this.addressId = e.data.addressId;
				this.info.defaultAddress = this.info.defaultAddress ? this.info.defaultAddress : {};
				this.info.defaultAddress.receiveName = e.data.receiveName;
				this.info.defaultAddress.mobile = e.data.mobile;
				this.info.defaultAddress.areaInfo = e.data.areaInfo;
				this.info.defaultAddress.addressInfo = e.data.addressInfo;
                uni.removeStorage({
                    key:'selectAddress'
                })
            }
        })
		
		//选择认证页
		uni.getStorage({
		    key:'selectAuth',
		    success: (e) => {
				this.companyId = e.data.companyId;
				this.companyName= e.data.companyName;
				//换成接口获取认证信息
		        uni.removeStorage({
		            key:'selectAuth'
		        })
		    }
		})
		this.getInfo();
		// #ifdef H5
			pageSeo({pageType: 'indexPage'}).then((res)=>{
				document.title = res.pageTitle;
			})
		// #endif	
    },
    async onLoad(e) {
        this.priceId = e.priceId ? e.priceId : '';
	    this.goodsId = e.goodsId ? e.goodsId : '';
		if(this.goodsId){
			this.sendType = '自提'
		}
		console.log(this.$onLaunched)
		await this.$onLaunched;
		this.getInfo();
    },
	filters: {
	    fiforderAmount(price,num,freight, offAmount){
	      let newPrice = price ? price : 0
	      let newNum = num ? num : 0;
	      let newFreight = freight ? freight : 0
	      return (newPrice*newNum+newFreight - offAmount).toFixed(2)
	    },
		fiforderAmount2(orderAmount,offAmount){
			let newOrderAmount = orderAmount ? orderAmount : 0
			return (newOrderAmount - offAmount).toFixed(2)
		},
	  },
    methods:{
		changzk(index){
			let c = JSON.parse(JSON.stringify(this.couponList[index]))
			c.isZK = !c.isZK
			this.couponList.splice(index,1,c)
		},
		valChange(e){
			// console.log(e.value)
			this.goodsNum = e.value
			this.getCouponList()
		},
		seeCoupon(){
			this.value = this.couponSn
			this.show = true
		},
		closeShow(){
		   this.show = false
		},
		save(){
			this.couponSn = this.value
			this.show = false
		},
		getCouponList(){
			  let data = {}
			  data.goodsId = this.goodsId;
			  data.priceId = this.priceId;
		      data.goodsNum = this.goodsId ? this.goodsNum : this.info.priceNum
			  this.couponSn = ''
			  orderCouponList(data).then((res)=>{
				  let list = res
				  list.forEach((el)=>{
				  	el.isZK = false
				  })
				  
				this.couponList = list
				this.couponSn = this.couponList[0] ? this.couponList[0]['couponSn'] : ''
			  })
		},
		
		saveOrder(){
			let data = {}
			if(this.priceId){
			        data.companyId = this.companyId;
			        data.addressId = this.addressId;
			        data.priceId = this.priceId;
			        data.orderRemark = this.orderRemark;
					data.couponSn = this.couponSn
					if(this.info.sendTypes == '自提'){
						data.addressId = '';
					}
			  }else if(this.goodsId){
				data.companyId = this.companyId;
				data.addressId = this.addressId;
				data.goodsId = this.goodsId;
				data.orderRemark = this.orderRemark;
				data.goodsNum = this.goodsNum;
				data.sendType = this.sendType
				data.couponSn = this.couponSn
				if(data.sendType == '自提'){
				  data.addressId = ''
				}
			  }
				  
			if (!data.companyId) {
			  uni.showToast({
			    title: '请选择认证公司',
			    icon: 'none'
			  });
			  return;
			}
			if(this.sendType == ''&& this.goodsId){
				uni.showToast({
				  title: '请选择交货方式',
				  icon: 'none'
				});
				return;
			}	
			if (!data.addressId &&((this.info.sendTypes != '自提'&& this.priceId) || (this.sendType != '自提'&& this.goodsId))) {
			  uni.showToast({
			    title: '请选择收货地址',
			    icon: 'none'
			  });
			  return;
			}
			
			if(this.goodsId){
				console.log("this.goodsNum",this.goodsNum)
				if (this.goodsNum <= 0) {
				  uni.showToast({
				    title: '货物数量请输入大于0的数',
				    icon: 'none'
				  });
				  return;
				}
				let step = (parseInt((this.goodsNum*1e5).toFixed(0))) % (parseInt((this.info.goodsWeight*1e5).toFixed(0)))
				if (step != 0) {
				  uni.showToast({
				    title: '请按包装的倍数输入货物数量',
				    icon: 'none'
				  });
				  return;
				}
			}
			this.btnLoading = true;
			uni.showLoading({
			  title: '正在提交'
			})
			//实际应用中请提交ajax,模板定时器模拟提交效果
			createOrder(data).then((data)=>{
				
				uni.hideLoading();
				uni.showModal({
				    title: "提示",
				    showCancel:true,
					cancelText:'去首页',
				    confirmText:'查看订单',
				    content:'您的订单已经生成，请及时使用平台合同模板签订合同，摩塑网监制，更放心！更安全！',
				}).then(res=>{
					if (res[1].confirm) {
						uni.navigateTo({
						  url: "/pages/my/orderInfo?orderId="+data.orderId
						})
						console.log('用户点击确定');
					} else if (res[1].cancel) {
						uni.switchTab({
						  url: '/pages/index/index'
						})
						console.log('用户点击取消');
					}
				   
				}).catch(res=>{})
				// #ifdef MP-WEIXIN
				wx.requestSubscribeMessage({
				  tmplIds: ['1RE5HylgPfV_GsV0s5DgEYPsEPIzo3Ln7fDXNQdvI40','wPbVQI4O6HFQLwT2ck0xEihpixo_Rn0t4LeGE-KLOS8','taD593KxeXZ2t65spUHzuk1HoSY2xDf7989BkafU7DA'],
				  success (res) {
							
						},
						fail(res){
							// console.log("res",res)
						},
						complete(){
							// console.log("89646456")
						}
				})
				// #endif
				this.btnLoading = false;
			}).catch(()=>{
				this.btnLoading = false;
			})
		},
		getInfo(){
			 let data = {}
			  data.goodsId = this.goodsId;
			  data.priceId = this.priceId
			preOrderContent(data).then((res)=>{
				this.info = res;
				this.addressId = res.defaultAddress && res.defaultAddress.addressId ? res.defaultAddress.addressId : '';
				this.companyId = res.companyId ? res.companyId : '';
				this.companyName = res.companyName ? res.companyName : '';
				this.goodsNum = res.minBuyNum ? res.minBuyNum : 0;
				this.getCouponList()
			})
		},
       toAddressList(){
		   uni.navigateTo({
		       url:"/pagesUser/user/myAddressList?type=select"
		   })
	   },
	   toMyAuthenticationList(){
		   uni.navigateTo({
		       url:"/pagesUser/user/myAuthenticationList?type=select"
		   })
	   },
    }
}
</script>

<style lang="scss">
	@import '@/style/common.scss';
	.order-info-page{
	  min-height: 100vh;
	  padding-top:0;
	  background: $background-color;
	  padding-bottom:66px;
	  .order-info-top{
	    height:100px;
	    background: linear-gradient(90deg, #fd7505 0%, #ff4e00 100%), linear-gradient(#ffffff, #ffffff);
		@include flexbox(flex-start,center);
	    color:#fff;
	    .order-state{
	      width:60%;
	      padding-left:20px;
	      .main-text{
	        font-size:$b-font;
	      }
	      .sub-text{
	        margin-top:10px;
	        font-size:$s-font;
	      }
	    }
	    .order-img{
	      width:40%;
	      padding-right:20px;
	      text-align: right;
	      image{
	        width:100px
	      }
	    }
	  }
	  .order-info-adr{
	    padding:16px;
	    background: #fff;
		@include flexbox(flex-start,center);
	    .img{
	      width:30px;
	      image{
	        width:100%;
	      }
	    }
	    .adr-info{
	      font-size:$m-font;
	      color:$font-color;
	      width:calc(100% - 30px);
	      padding-left:20px;
	      .adr-top{
	        line-height: 22px;
	        .name{
	          font-weight: bold;
	          padding-right:10px
	        }
	      }
	    }
	  }
	  .order-block{
	    margin-top:$marginSpace;
		background: #fff;
		.u-slot-title{
			font-size:$m-font
		}
		.u-slot-value{
			font-size:$m-font;
			width:calc(100% - 200rpx);
		}
		.order-title{
			font-size:$m-font;
			padding:10px 15px
		}
		.order-row{
			line-height: 48rpx;
			font-size:24rpx;
			@include flexbox(space-between,flex-start);
			margin-top:20rpx;
			.label{
				color:#929292
			}
			.text{
				color: #000;
			}
		}
		.goods-item{
		  @include flexbox(flex-start,center);
		  padding:32rpx;
		  .goods-info{
				   width:100%;
		    .goods-name{
		      font-size:$m-font;
		      color:$font-color;
					font-weight: bold;
		    }
		    .goods-attr{
		      margin-top:5px;
		      font-size:$s-font;
		      color:$g-font-color
		    }
		    .goods-price-num{
		      margin-top:5px;
					@include flexbox(space-between,center);
		      .price{
		        font-size:$m-font;
		        color:$theme-color
		      }
		      .num{
		        font-size:$s-font;
		        color:$g-font-color;
			    float:right;
		      }
		    }
		  }
		}
	
	  };
	  .order-price-block{
		  .order-price-label{
			  font-size:$m-font;
		  }
		  .order-price-text{
			  font-size:$m-font;
			  color:#ff0000;
			  font-weight:bold
		  }
	  }
	  .order-item-top{
	
	    padding:10px 16px;
	    font-size:$m-font;
		@include flexbox(space-between,center);
	    position: relative;
	    .store-name{
	      color:$font-color;
	      @include textoverflow(1);
	      padding-right:10px;
	    }
	    .order-state{
	      color:$theme-color;
	      white-space: nowrap;
	    }
	  }
	  .order-item-top:after{
	    @include borderBottom(); 
	  }
	  .goods-item{
	    @include flexbox(flex-start,center);
	    padding:16px;
	    .goods-info{
		   width:100%;
	      .goods-name{
	        font-size:$m-font;
	        color:$font-color;
			@include textoverflow(2);
	      }
	      .goods-attr{
	        margin-top:5px;
	        font-size:$s-font;
	        color:$g-font-color
	      }
	      .goods-price-num{
	        margin-top:5px;
			@include flexbox(space-between,center);
	        .price{
	          font-size:$m-font;
	          color:#ff0000
	        }
	        .num{
	          font-size:$s-font;
	          color:$g-font-color;
			  float:right;
	        }
	      }
	    }
	  }
	  .orderRemark{
	    @include flexbox(flex-start,flex-start);
	    background: #fff;
	    padding:10px 16px;
	    font-size:$m-font;
	    color:$font-color;
	    .label{
	      width:80px;
	
	    }
	    .text{
	      width:calc(100% - 80px)
	    }
	  }
	  .order-info-block{
	    background: #fff;
	    padding:16px;
	    .info-title{
	      border-left:2px solid $theme-color;
	      font-size:$m-font;
	      color:$font-color;
	      line-height: 16px;
	      padding-left:10px;
	      margin-bottom:10px;
	    }
	    .info-con{
	      .info-row{
		   @include flexbox(flex-start,flex-start);
	        padding-left:10px;
	        font-size:$m-font;
	        line-height:26px;
	        .label{
	          color:$g-font-color;
	          width:80px;
	        }
	        .text{
	          width:calc(100% - 80px);
	          color:$font-color
	        }
	      }
	    }
	  }
	  .page-bottom-btn{
	    position: fixed;
	    height:50px;
	    background: #fff;
	    width:100%;
	    bottom:0;
	    padding:0 10px;
		@include flexbox(flex-start,center);
	    .bottom-left{
	      width:40%;
	      font-size:$m-font;
	      span{
	        color:$theme-color
	      }
	    }
	    .bottom-right{
	      width:60%;
	      text-align: right;
	    }
	  }
	  .releaseBaoJia{
	    .title{
	      font-size:$b-font;
	      color:$font-color;
	      text-align: center;
	      height:50px;
	      line-height: 50px;
	      position: relative;
	    }
	    .title:after{
			@include borderBottom()
	    }
	    .van-cell:first-child input.van-field__control{
	      text-align: right;
	    }
	  }
	}
	.popupTitle{
		font-size:$b-font;
		font-weight: bold;
		text-align: center;
		line-height: 50px;
	}
	.popup-con{
	 	padding:0 16px 16px 16px;
			.u-radio-group--row{
				flex-wrap: wrap;
			}
	 	.coupon-item{
	 	        border-radius: 18rpx;
	 	        background: rgb(255,242,242);
	 	        width:calc(100vw - 160rpx);
	 	        position: relative;
	 			padding-bottom:10rpx;
	 			margin-bottom:30rpx;
	 	        .coupon-label{
	 	          padding:4rpx 20rpx;
	 	          line-height:32rpx;
	 	          display: flex;
	 			  width:fit-content;
	 	          background: linear-gradient(to right, rgb(255,122,1), rgb(255,41,182));
	 	          color:#fff;
	 	          font-size: 24rpx;
	 	          border-top-left-radius: 18rpx;
	 	          border-bottom-right-radius: 18rpx;
	 	        }
	 	        .coupon-top{
	 	          display: flex;
	 	          justify-content: space-between;
	 	          align-items: flex-start;
	 	          padding:24rpx;
	 	          .coupon-name{
	 	            font-size: 32rpx;
	 	          }
	 	          .coupon-time{
	 	            font-size: 24rpx;
	 	            color:#888;
	 	            padding-top: 10rpx;
	 	          }
	 	          .top-right{
	 	            text-align: center;
	 	            .coupon-price{
	 	              font-size:36rpx;
	 	              font-weight:bold;
	 	              color:#ff4600;
	 	              .span{
	 	                font-size: 24rpx;
	 	                font-weight: 400;
	 	                padding-left:10rpx;
	 	              }
	 	            }
	 	            .right-bottom{
	 	              margin-top:4rpx;
	 	              color:#888;
	 				  font-size: 24rpx;
	 	            }
	 	          }
	 	        }
	 	        .coupon-bottom{
	 	          padding:10rpx 24rpx;
	 	          .coupon-line{
	 	            height:10rpx;
	 	            border-top: 2rpx dashed #f4b4b4;
	 	          }
	 	          .coupon-text{
	 	            padding-top:6rpx;
	 	            font-size: 24rpx;
	 	            white-space: nowrap; /* 保证文本在一行内显示 */
	 	            overflow: hidden; /* 隐藏溢出的内容 */
	 	            text-overflow: ellipsis;
	 	            color:#888;
	 	            cursor: default;
	 	          }
	 	        }
	 	    }
	 
	 }
	
</style>